









/* App Dark
==================================================================================== */

/* Global
------------------------------------------------------------------------------------ */

.app-dark {
	background: #3F3F3F;
}

.app-dark h1, .app-dark h2, .app-dark h3 {
    color: white;
    text-shadow: 0 2px 1px black;
}

.app-dark pre {
background: white;
}

.app-dark a {
	color: #e9b700;
}

.app-dark a:hover {
	color: #e99400;
}

/* Icons
------------------------------------------------------------------------------------ */

/* Actions */

.app-dark .actions {
	text-shadow: none;
}

.app-dark .actions a span.icon {
	background-image: url(/css/smoothness/images/ui-icons_e9b700_256x240.png);
	width: 13px;
	height: 13px;
	display: inline-block;
	margin-right: 3px;
}

.app-dark .actions a:hover span.icon {
	background-image: url(/css/smoothness/images/ui-icons_e99400_256x240.png);
}

/* Layout
------------------------------------------------------------------------------------ */

/* Header */

.app-dark header {
	background: #222;
}

.app-dark .logo {
    padding-bottom: 0.5em;
    background: url(/images/textures/perforated.gif);
	border-bottom: 1px solid black;
}

.app-dark .logo h1 {
    background: url("/images/ss/ss2.png") no-repeat -10px -5px transparent;
    display: inline-block;
    height: 40px;
    margin-top: 0.5em;
    width: 80px;
}

.app-dark .logo h1 span {
	display: none;
}

/* Menu */

.app-dark .menu {
	background: #111111; /* old browsers */
	background: -moz-linear-gradient(top, #111111 0%, #111111 92%, #000000 93%, #646464 94%, #3F3F3F 95%, #3F3F3F 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#111111), color-stop(92%,#111111), color-stop(93%,#000000), color-stop(94%,#646464), color-stop(95%,#3F3F3F), color-stop(100%,#3F3F3F)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#111111', endColorstr='#3F3F3F',GradientType=0 ); /* ie */
}

.app-dark .menu ul.tabs li a {
    color: white;
	outline: none;
}

.app-dark .menu ul.tabs li a {
    margin-top: 0.5em;
	padding-bottom: 1em;
}

.app-dark .menu ul.tabs li a.active {
    -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.8);
    background: #111111;
	border-bottom: 1px solid #0b0b0b;
}

/* Login */

.app-dark .login {
    background: #3F3f3f;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 0 20px black;
}

/* General List
------------------------------------------------------------------------------------ */

.app-dark ul.list {
	color: #FFF;
	text-shadow: 1px 1px 1px black;
	border: 1px solid #222;
	border-bottom: none;
	border-top: none;
}

/* Header rows */

.app-dark ul.list li.th {
    background-color: #222 !important;
}

.app-dark ul.list li.th p {
    border-top: 1px solid #444;
    border-bottom: 1px solid #111;
	text-transform: capitalize;
}

/* Header cells */

.app-dark ul.list li.th p:first-child {
	border-left: none;
}

.app-dark ul.list li.th p:last-child {
	border-right: none;
}

/* Rows */

.app-dark ul.list li.td:nth-child(odd) {
	background-color: #555555;
}

.app-dark ul.list li.td:nth-child(even) {
	background-color: #3f3f3f;
}

/* Cells */

.app-dark ul.list li.td p {
	border-top: 1px solid #646464;
	border-bottom: 1px solid #2e2e2e;
}

.app-dark ul.list li.td p:last-child {
	text-align: right;
}

/* Cell links */

.app-dark ul.list li.td p a {
	color: white;
	display: block;
}

.app-dark ul.list li.td:hover p a {
	color: #e9b700;
}

.app-dark ul.list li.td p .actions a {
	display: inline-block;
}

.app-dark ul.list li.td:hover p .actions a:hover {
	color: #e99400;
}

/* Legend */

.app-dark .legend, .app-dark .itemid {
	padding: 0.3em 0.7em;
	color: #FFF;
}

.app-dark .legend {
	background-color: #131313;
	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	border-top: 1px solid #222;
	-moz-box-shadow: 0 1px 0px #333 inset;
	-webkit-box-shadow: 0 1px 0px #333 inset;
	border-bottom: 1px solid black;
}

/* Itemid */

.app-dark .itemid {
	background: #222;
	border-bottom: 1px solid black;
	text-transform: capitalize;
	text-shadow: 1px 1px 1px black;
	-moz-box-shadow: 0 0 4px black inset;
}

/* Submits */

.app-dark .submits {
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
    background-color: #131313;
    border-left: 1px solid #111111;
    border-right: 1px solid #111111;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
    padding: 10px;
	-moz-box-shadow: 0 1px 0px #333 inset;
	-webkit-box-shadow: 0 1px 0px #333 inset;
}

/* Sections: Edit
------------------------------------------------------------------------------------ */

.app-dark .edit {
	max-width: 500px;
}

/* List */

	/* Rows */

	.app-dark .edit ul.list li:nth-child(odd) {
		background-color: #3f3f3f;
	}

	/* Cells */

	.app-dark .edit ul.list li p {
		padding: 0.7em 2em 0.7em 1em;
	}

	.app-dark .edit ul.list li p:last-child {
		text-align: left;
	}

/* Inputs */

.app-dark .edit input[type="text"], .app-dark .edit input[type="password"], .app-dark .edit textarea, .app-dark .edit select {
	width: 100%;
}

.app-dark .edit input[type="text"], .app-dark .edit input[type="password"], .app-dark .edit textarea, .app-dark .edit select {
	border: 1px solid grey;
	border-top: 1px solid #2E2E2E;
	background: #222;
	color: grey;
}

.app-dark .edit input[type="text"]:hover, .app-dark .edit input[type="password"]:hover, .app-dark .edit textarea:hover, .app-dark .edit select:hover {
	color: white;
}

.app-dark .edit input[type="text"]:focus, .app-dark .edit input[type="password"]:focus, .app-dark .edit textarea:focus, .app-dark .edit select:focus {
	border: 1px solid orange;
	color: white;
}














/*
 * App Classic
 ==============================================================================================================
 */

/* Global
------------------------------------------------------------------------------------ */

.app-classic {
	background: url(/images/textures/grain.png) #EEE;
	color: black;
}

.app-classic h1 {
	color: white;
}

.app-classic h1, .app-classic h2, .app-classic h3 {
	text-shadow: 0 1px 0 white;
}

.app-classic a {
	color: #3B5998;
}

/* Icons
------------------------------------------------------------------------------------ */

.app-classic .actions a span.icon {
	background-image: url(/css/smoothness/images/ui-icons_222222_256x240.png);
	width: 13px;
	height: 13px;
	display: inline-block;
	margin-right: 3px;
}

.app-classic .actions a:hover span.icon {
	background-image: url(/css/smoothness/images/ui-icons_3b5998_256x240.png);
}

/* Layout
------------------------------------------------------------------------------------ */

/* Header */

.app-classic header {
	background: #621244;
	background: url(/images/textures/bokeh.png) #3C4C5C;
}

.app-classic .logo {
	border-bottom: 1px solid rgba(0,0,0,0.2);

}

.app-classic .logo h1 {
    background: url("/images/ss/ss3.png") no-repeat scroll left center transparent;
    display: inline-block;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	width: 264px;
	height: 64px;
	margin-top: 0.2em;
}

.app-classic .logo h1 span {
	display: none;
}

/* Menu */

.app-classic .menu {
    border-top: 1px solid rgba(255,255,255,0.2);
	background: rgba(0,0,0,0.1);
}

.app-classic .menu ul.tabs li a {
    outline: none;
    margin-top: 0.8em;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
	padding: 0.5em 1.5em;
	color: white;
	font-weight: bold;
	text-shadow: 1px 1px 0px rgba(0,0,0,0.2);
}

.app-classic .menu ul.tabs li a:hover {
	background: rgba(255,255,255,0.2);
}

.app-classic .menu ul.tabs li a.active {
    background: url(/images/textures/grain.png) #EEE;
	color: black;
	text-shadow: 1px 1px 0px white;
}

/* Submenu */

.app-classic .submenu ul.tabs li a.active {
	border-bottom: 2px solid #CCC;
}

/* General List
------------------------------------------------------------------------------------ */

.app-classic ul.list {
	padding: 0.5em 1em;
	background: white;
	border-left: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
}

/* Header row */

.app-classic ul.list li.th {
	font-weight: bold;
}

/* Rows */

.app-classic ul.list li:nth-child(even) {
	background: #EEE; /* old browsers */
	background: -moz-linear-gradient(top, #FFFFFF 2%, #E0E0E0 3%, #EEE 99%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,#FFFFFF), color-stop(3%,#E0E0E0), color-stop(99%,#EEE)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E0E0E0', endColorstr='#EEE',GradientType=0 ); /* ie */
}

.app-classic ul.list li:nth-child(odd) {
	background-color: #FFF;
}

/* Cell */

.app-classic ul.list li p {
	border-bottom: 1px solid #CCC;
}

.app-classic ul.list li p:last-child {
	text-align: right;
	padding-right: 1em;
}

/* Cell links */

.app-classic ul.list li.td p a {
	display: block;
	color: #222;
}

.app-classic ul.list li.td p .actions a {
	display: inline-block;
}

.app-classic ul.list li.td p .actions a:hover {
	color: #3B5998;
}

/* Legend */

.app-classic .legend {
	border: 1px solid #CCC;
	padding: 0.3em 1em;
	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	background: #EEE; /* old browsers */
	background: -moz-linear-gradient(top, #E0E0E0 0%, #EEE 99%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#E0E0E0), color-stop(99%,#EEE)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E0E0E0', endColorstr='#EEE',GradientType=0 ); /* ie */
	-moz-box-shadow: 0 1px 0 white inset;
}

/* Itemid */

.app-classic .itemid {
	background: #DDD;
	border-style: solid;
	border-width: 1px;
	border-color: #EEE #CCC #CCC;
	padding: 0.5em 1em;
}

/* Submits */

.app-classic .submits {
	border: 1px solid #CCC;
	border-top: none;
	-moz-border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;
	padding: 1em;
	background: #ffffff; /* old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* ie */	
}

/* Sections: Edit
------------------------------------------------------------------------------------ */

.app-classic .edit {
	max-width: 500px;
}

/* Edit List */

	/* Row */

	.app-classic .edit ul.list li:nth-child(even) {
		background: none;
	}

	/* Cell */

	.app-classic .edit ul.list li p {
		padding: 0.7em 0em 0.7em 1em;
		border-bottom: 1px solid #EEE;
	}

	.app-classic .edit ul.list li:last-child p {
		border: none;
	}

	.app-classic .edit ul.list li p:last-child {
		text-align: left;
		padding-left: 2.5em;
	}

	.app-classic .edit ul.list li p:first-child {
		text-align: right;
		color: #666;
	}

	/* Submits */

	.app-classic .edit .submits {
		border-top: 1px solid #DDD;
	}


	




/* App Server
==================================================================================== */

/* Global
------------------------------------------------------------------------------------ */

.app-server {
	color: #3F474A;
}

.app-server a {
	color: #A3B618;
}

/* Layout
------------------------------------------------------------------------------------ */

/* Main */

.app-server .container {
	width: 97%;
}

.app-server header .container {
	width: 100%;
}

/* Header */

.app-server header {
	background: url(/images/textures/server.gif) #3e4d59 repeat-x top;
}

.app-server .menu {
	background: #C5CC7E; /* old browsers */
	background: -moz-linear-gradient(top, #3e4d59 0%, #3e4d59 9%, #C5CC7E 10%, #C5CC7E 11%, #B7BB66 13%, #AFB752 14%, #BFC74D 50%, #9FAD00 50%, #A9B604 55%, #A9B604 58%, #A7B404 78%, #B6CC12 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#C5CC7E), color-stop(3%,#C5CC7E), color-stop(4%,#B7BB66), color-stop(10%,#AFB752), color-stop(50%,#BFC74D), color-stop(50%,#9FAD00), color-stop(55%,#A9B604), color-stop(58%,#A9B604), color-stop(78%,#A7B404), color-stop(100%,#B6CC12)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#C5CC7E', endColorstr='#B6CC12',GradientType=0 ); /* ie */
	-moz-box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2) inset;
}

.app-server .logo h1 {
	color: white;
	font-size: 3em;
	font-weight: bold;
	background: url(http://panel.elserver.com/img/encabezado/isologo.gif);
	width: 348px;
	height: 83px;
}

.app-server .logo h1 span {
	display: none;
}

/* Menu */

.app-server .menu ul.tabs {
	overflow: auto;
}

.app-server .menu ul.tabs li {
	float: left;
}

 .app-server .menu ul.tabs li a {
	color: white;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 13px;
	padding: 0.5em 3em 0.4em;
	text-shadow: 0 0 4px rgba(0,0,0,0.8);
	border-top: 1px solid transparent;
	-moz-box-shadow: 1px 3px 0 rgba(0, 0, 0, 0.2);
}

.app-server .menu ul.tabs li a:hover {
	text-shadow: 0 0 4px rgba(0,0,0,1);
}

.app-server .menu ul.tabs li a.active {
	background: #FFF;
	color: #3e4c59;
	text-shadow: none;
	border-color: white;
	-moz-border-radius: 5px 5px 0 0;
	margin-bottom: -10px;
 }
 
.app-server .submenu ul.tabs li a {
	padding: 1em 1.5em 0.6em;
} 

/* Submenu */

.app-server .submenu { 
	background: #ffffff; /* old browsers */
	background: -moz-linear-gradient(top, #ffffff 43%, #e5e5e5 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(43%,#ffffff), color-stop(100%,#e5e5e5)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* ie */
}

.app-server .submenu a {
	color: #3e4d59;
	text-transform: capitalize;
	text-shadow: 1px 1px 0px white;
}

.app-server .submenu a.active {
	font-weight: bold;
}

/* Content */

.app-server .content .controller {
	display: none;
}


/* General List
------------------------------------------------------------------------------------ */

.app-server ul.list {
	background: white;
}

/* Header row */

.app-server ul.list li.th {
	font-weight: bold;
	-moz-border-radius: 5px 0 0 0;
}

.app-server ul.list li.th:first-child {
	-moz-border-radius: 5px 0 0 0;
}

/* Header cell */

.app-server ul.list li.th p {
	border-bottom: 1px solid #b5d10d;
	padding: 0.5em 1em;
	background: #CDE60F; /* old browsers */
	background: -moz-linear-gradient(top, #CDE60F 0%, #B6CC12 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#CDE60F), color-stop(100%,#B6CC12)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CDE60F', endColorstr='#B6CC12',GradientType=0 ); /* ie */
}

.app-server ul.list li.th p:first-child {
	border-left: 1px solid #b5d10d;
	border-top: none;
}

.app-server ul.list li.th p:last-child {
	border-right: 1px solid #b5d10d;
}

/* Cell */

.app-server ul.list li p {
	border-bottom: 1px solid #e6eeae;
	padding: 1em;
}

.app-server ul.list li p:first-child {
	border-left: 1px solid #c5c7c7;
}

.app-server ul.list li p:last-child {
	border-right: 1px solid #c5c7c7;
}

/* Cell links */

.app-server ul.list li.td p a {
	display: block;
	color: #3F474A;
}

.app-server ul.list li.td:hover {
	background: #ebf59d;
}

.app-server ul.list li.td p .actions a {
	display: inline-block;
	color: #A3B618;
}

.app-server .browse ul.list li p:last-child {
	text-align: right;
	padding-right: 1em;
}

/* Legend */
 
.app-server .legend {
	color: white;
	background: #3E4D59; /* old browsers */
	background: -moz-linear-gradient(top, #3E4D59 0%, #313C46 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3E4D59), color-stop(100%,#313C46)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3E4D59', endColorstr='#313C46',GradientType=0 ); /* ie */
	-moz-border-radius: 15px 0 0 0;
	border: 1px solid #666;
	border-bottom: none;
	-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
	-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
}

.app-server .legend h3 {
	font-size: 13px;
	font-weight: bold;
	padding: 0.5em 1em;
	letter-spacing: normal;
}

/* Itemid */

.app-server .itemid {
	background: -moz-linear-gradient(top, #bfbfbf 0%, #dddddd 100%); /* firefox */
	border-bottom: 1px solid #c5c7c7;
	padding: 0.4em 1em;
}

/* Submits */

.app-server .submits {
	background: -moz-linear-gradient(top, #FFF 0%, #e9e8e9 100%); /* firefox */
	padding: 1em;
	border-bottom: 1px solid #c5c7c7;
	border-left: 1px solid #c5c7c7;
	border-right: 1px solid #c5c7c7;
	-moz-border-radius: 0 0 5px 5px;
}

/* Sections: Edit
------------------------------------------------------------------------------------ */

.app-server .edit {
	width: 500px;
}

/* Inputs */

.app-server .edit input[type="text"], .app-server .edit input[type="password"], .app-server .edit textarea, .app-server .edit select {
	width: 90%;
}

/* Edit List */

	/* Cell */

	.app-server .edit ul.list li p {
		border-bottom: 1px solid #DDDDDD;
	}
	
	.app-server .edit ul.list li p:first-child {
		background: #EFEFEF;
		font-weight: bold;
	}
	
	/* Legend */
	
	.app-server .edit .legend {
		background: #CEE80E;
		border-color: #999;
		-moz-border-radius: 15px 15px 0 0;
		-webkit-border-radius: 15px 15px 0 0;
		border-radius: 15px 15px 0 0;
	}
	
	.app-server .edit .legend h3 {
		color: #3E4D59;
		font-weight: bold;
		text-align: center;
	}

	


	
	
	




	
	
	
	



/* App Grana
==================================================================================== */

.app-grana {
	background: #DDD;
}

.app-grana a {
	color: #2D878A;
}

.app-grana ul.list {
	background: #FFF;
	border: 1px solid #CCC;
	border-top: none;
	border-bottom: none;
	table-layout: fixed;
}

.app-grana ul.list li.th p {
	border-bottom: 1px solid #DDD;
	text-transform: capitalize;
	font-weight: bold;
	background: #EEE;
}

.app-grana ul.list li.td:nth-child(odd) {
	background-color: #f4f4f4;
}

.app-grana ul.list li.td:nth-child(even) {
	background-color: #fff;
}


.app-grana .legend {
	background: #BC0E0E; /* old browsers */
	background: -moz-linear-gradient(top, #BC0E0E 0%, #980B0B 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#BC0E0E), color-stop(100%,#980B0B)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#BC0E0E', endColorstr='#980B0B',GradientType=0 ); /* ie */
	-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
	-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
    border: 1px solid #980B0B;
	-moz-border-radius: 10px 10px 0 0;
	-webkit-border-radius: 10px 10px 0 0;
	border-radius: 10px 10px 0 0;
	padding: 0.5em 1em;
}

.app-grana .legend h3 {
    color: white;
    font-size: 130%;
    font-weight: bold;
    text-shadow: 1px 1px black;
}

.app-grana .submits {
	background: #ffffff; /* old browsers */
	background: -moz-linear-gradient(top, #ffffff 43%, #e5e5e5 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(43%,#ffffff), color-stop(100%,#e5e5e5)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* ie */
	padding: 1em;
	border: 1px solid #CCC;
	border-top: none;
	-moz-border-radius: 0 0 15px 15px;
	-webkit-border-radius: 0 0 15px 15px;
	border-radius: 0 0 10px 10px;
}

.app-grana .itemid {
	border: 1px solid #CCC;
	text-transform: capitalize;
	font-weight: bold;
	background: #EEE;
	padding: 0.5em 1em;
}

.app-grana .edit {
	max-width: 500px;
}

.app-grana .edit ul.list {
	padding: 1em;
}

.app-grana .edit ul.list p:first-child {
	text-align: right;
	padding-right: 2em;
	width: 40%;
}

/* Inputs */

.app-grana .edit input[type="text"], .app-grana .edit input[type="password"], .app-grana .edit textarea, .app-grana .edit select {
	width: 90%;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
    border: 1px solid #DDDDDD;
    padding: 0.5em;
}

